<template>
    <a-drawer
        :destroyOnClose="true"
        placement="right"
        :closable="true"
        :visible="visible"
        :maskClosable="true"
        :width="width"
        :title="title"
        @close="cancel">
        <a-spin :spinning="confirmLoading">
           
            <!-- 这里放自己的组件 -->
            <LForm v-if="formAttributes" ref="LForm" @clickEventHandler="clickEventHandler"  @changeEventHandler="changeEventHandler"  :formAttributes="formAttributes" ></LForm>
            <br /><br />
            <div class="table-operator" v-if="isCanEdit">
                <a-button shape="round" size="small" type="primary" icon="plus" @click="selectPackage">选择快递</a-button>
            </div>
            <LTable
                ref="packageList"
                size="middle"
                :rowKey="record=>record.keyId"
                :columns="columns"
                axiosUrl="/KhyPackageController/list"
                :showPagination="false"
                :showQueryForm="true"
                :initQuery="[]"
                :isAutoLoad="false"></LTable>
        </a-spin>
       
        <div style="height:30px;"></div>
        <div class="drawer-bootom-button" v-if="isCanEdit">
            <a-button shape="round" @click="cancel" style="margin-right: .8rem">取消</a-button>
            <a-button  shape="round" @click="ok" type="primary" >提交</a-button>
        </div>

        <selectPackage ref="selectPackage" @onAddPackage="onAddPackage"></selectPackage>
    </a-drawer>
    
</template>

<script>
import LForm from '@/components/lt/form/LForm'
import pick from 'lodash.pick'
import request from '@/utils/request'
import moment from 'moment'
import LTable from '@/components/lt/LTable'
import {SysMixin} from '@/mixins/SysMixin'
import defaultSettings from '@/config/defaultSettings'
import selectPackage from '@/views/khy/package/selectPackage'


export default {
    name:'arrivalForm',
    components:{LForm,LTable,selectPackage},
    mixins:[SysMixin],
   
    data(){
        return{
            initDictCodes:defaultSettings.数据字典.车辆下拉+','+defaultSettings.数据字典.司机下拉+','+defaultSettings.数据字典.客运站下拉+','+defaultSettings.数据字典.快递状态下拉,
            defaultSettings,
            moment,
            visible:false,
            model:{},
            confirmLoading:false,
            title:'标题',
            width:document.documentElement.clientWidth-200,
            formAttributes:{
              type:'',//collapse,tabs
              formItems:[
                {
                  title:'标签一',
                  columns:1,
                  fields:[
                        {field:'plateNo',label:'车牌号',component:'select',dictCode:defaultSettings.数据字典.车辆下拉,rules: [{required: true, message: '不能为空!'}]},
                        {field:'driverNo',label:'司机',component:'select',dictCode:defaultSettings.数据字典.司机下拉,rules: [{required: true, message: '不能为空!'}]},
                        {field:'createTime',label:'时间',component:'time',rules: [{required: false, message: '不能为空!'}],disabled:true},
                        {field:'transportState',label:'运单状态',component:'select',disabled:true,dictCode:defaultSettings.数据字典.货运单状态下拉,initialValue:'1'},
                    ]
                },
              ]

            },
            columns:[
                {
                    title: '序号',
                    dataIndex: '',
                    key:'rowIndex',
                    width:60,
                    align:"center",
                    customRender:function (t,r,index) {
                      return parseInt(index)+1;
                    }
                },
                {
                    title: '快递单号',
                    dataIndex: 'packageNo'
                },
                
                {
                    title: '发运站',
                    dataIndex: 'startStation',
                    customRender:(text)=>{
                        if(!text){
                            return ''
                        }else{
                            return this.dictText(defaultSettings.数据字典.客运站下拉,text)
                        }
                    }
                },
                {
                    title: '到达站',
                    dataIndex: 'endStation',
                    customRender:(text)=>{
                        if(!text){
                            return ''
                        }else{
                            return this.dictText(defaultSettings.数据字典.客运站下拉,text)
                        }
                    }
                },
                {
                    title: '托运人姓名',
                    dataIndex: 'senderName'
                },
                {
                    title: '收件人姓名',
                    dataIndex: 'consigneeName'
                },
                {
                    title: '托运人电话',
                    dataIndex: 'senderPhone'
                },
                {
                    title: '收件人电话',
                    dataIndex: 'consigneePhone'
                },
                {
                    title:'快递状态',
                    dataIndex:'packageState',
                    customRender:(text)=>{
                        if(!text){
                            return ''
                        }else{
                            return this.dictText(defaultSettings.数据字典.快递状态下拉,text)
                        }
                    }
                },
                
            ],
            isCanEdit:true,
            
  
        }
    },
    created(){
    },
    computed:{
       
    },
    watch:{
        
    },
    methods:{
        edit (record) {
            this.visible = true
            this.model = Object.assign({}, record)
            this.$nextTick(() => {
               //自己业务
                this.getForm().setFieldsValue(pick(this.model,'plateNo','driverNo','createTime','transportState'))
                if(this.model.keyId){
                    this.isCanEdit=false
                    this.$refs['packageList'].setInitQuery([{field:'transportId',val:this.model.keyId}])
                    this.$refs['packageList'].searchQuery()
                }else{
                    this.isCanEdit=true
                }
            })
          
        },
        selectPackage(){
            this.handleEdit({},'selectPackage','快递选择')
        },
        onAddPackage(packageList){
            if(!packageList){
                return false
            }
            let that = this
            let list = that.$refs["packageList"].localDataSource || []
            
            let idList= list.map(item => item['keyId'])
            packageList.filter( item => {
                if(!idList.includes(item['keyId'])){
                    that.$refs["packageList"].localDataSource.push(item)
                }
            })
            // 取消分页
            that.$refs["packageList"].localPagination=false

        },
        
        ok(){
            let that = this
            let list = that.$refs["packageList"].localDataSource
            if(list.length==0){
                that.$message.warning("请先添加要运输的快递");
                return false
            }

            that.getForm().validateFields((err, values) => {
                if (!err) {
                    that.confirmLoading = true
                    let formData = Object.assign(this.model, values);
                    let data = {transport:formData,packageList:list}
                    
                    request({url: '/KhyTransportController/save',method: 'post',data: data}).then((res)=>{
                        if(res.success){
                            //关闭，为了刷新LIST数据
                            that.close()
                            that.$message.success("保存成功")
                            //数据回显
                            that.edit(res.result)
                        
                            
                        }else{
                            that.$message.warning(res.message);
                        }
                    }).finally(() => {
                        that.confirmLoading = false;
                    })
                    
                }
            })
            this.$emit('handleOk');
        },
        cancel(){
            this.visible=false
            this.$emit('handleCancel');
        },
        close () {
            this.$emit('close');
            this.visible = false;
        },
        /**
         * 获取form对象
         */
        getForm(){
            return this.$refs.LForm.form
        },
        changeEventHandler(changeItem){
            this.$emit('changeEventHandler',changeItem);
        },
        clickEventHandler(field,form){
            this.$emit('clickEventHandler',field,form);
        },
    }

}
</script>



<style  scoped>
  .drawer-bootom-button {
    position: absolute;
    z-index: 999999;
    bottom: 0;
    width: 100%;
    /* border-top: 1px solid #e8e8e8; */
    padding: 10px 16px;
    text-align: right;
    left: 0;
    background: #fff;
    border-radius: 0 0 2px 2px;
  }

</style>